<template>
    <div>
        <div class="my-top">
            <van-icon name="arrow-left" class="hicon" @click="onClickBack" />
            <van-search
            v-model="keyword"
            show-action
            placeholder="请输入搜索关键词"
            >
                <template #action>
                    <div  class="my-search">搜索</div>
                </template>
            </van-search>
        </div>
    </div>
</template>

<script>
export default {
    data() {
        return {
            keyword: ''
        }
    },
    methods: {
        onClickBack () {
            this.$router.go(-1)
        },
        onSearch() {
            
        }
    }
}
</script>

<style lang="scss">
.my-top {
    display: flex;
    justify-content: space-around;
    align-items: center;
    .van-icon-arrow-left, .van-search__action, .van-icon-search {
        color: #1989fa;
    }
    .van-icon-arrow-left {
        font-size: 4.267vw;
    }
    .van-search__content {
        border-radius: 30px;
    }
    // .van-search--show-action {
    //     padding-right: 20px;
    // }
    // .my-search {
    //     margin-left: 20px;
    // }
}
</style>